{%extends 'theme/'+GetConfig('theme')+'/layout.html'%}

{%block content%}
<link rel="stylesheet" href="https://cdnjs.loli.net/ajax/libs/aplayer/1.10.1/APlayer.min.css">
<script src="https://cdnjs.loli.net/ajax/libs/aplayer/1.10.1/APlayer.min.js"></script>

<div class="layui-container">
  <br>
  <center>
  <div style="width: 100%;" id="audio-player"></div>

  </center>
  <br>
    <!-- 固定标签 -->
    <div class="layui-form layui-form-pane">
      <div class="layui-form-item" pane>
        <label class="layui-form-label"><a onclick="copyUrl('share')"><i class="fa fa-share-alt" aria-hidden="true"></i>分享地址(点击复制)</a></label>
        <div class="layui-input-block">
            <input type="text" id="share" class="layui-input" value="{{url.split('?')[0]}}?action=share" >
        </div>
      </div>
    </div>
    <div class="layui-form layui-form-pane">
      <div class="layui-form-item" pane>
        <label class="layui-form-label"><a onclick="copyUrl('share')"><i class="fa fa-share-alt" aria-hidden="true"></i>内嵌窗口(点击复制)</a></label>
        <div class="layui-input-block">
            <input type="text" id="share" class="layui-input" value="{{url.split('?')[0]}}?action=share" >
        </div>
      </div>
    </div>
    <div class="layui-form layui-form-pane">
      <div class="layui-form-item" pane>
        <label class="layui-form-label"><a onclick="copyUrl('use_outer')"><i class="fa fa-link" aria-hidden="true"></i>调用地址(点击复制)</a></label>
        <div class="layui-input-block">
          <input type="text"  id="use_outer" class="layui-input" value="{{url}}" >
        </div>
      </div>
    </div>
    <script>
          //参考了olaindex
          $(function () {
              var cnt=1;
              const ap = new APlayer({
                  container: document.getElementById('audio-player'),
                  audio: [{
                      name: '{{ name }}',
                      url: "{{url}}",
                      cover: 'cover.jpg'
                  }]
              });
              // 防止出现401 token过期

                  ap.on('error', function () {
                      if(cnt<=3){
                          console.log('播放出错，尝试第'+cnt+'次')
                          let last = ap.audio.currentTime;
                          ap.audio.src = "{{url}}";
                          ap.audio.load();
                          ap.audio.currentTime = last;
                          ap.play();
                          cnt=cnt+1;
                          }
                  });

              // 如果是播放状态 & 没有播放完 每25分钟重载视频防止卡死
              setInterval(function () {
                  if (!ap.audio.paused && !ap.audio.ended) {
                      let last = ap.audio.currentTime;
                      ap.audio.src = "{{url}}";
                      ap.audio.load();
                      ap.audio.currentTime = last;
                      ap.play();
                  }
              }, 1000 * 60 * 25)
          });
    </script>
</div>
    <a href="{{url}}" class="fab-fixed"><i class="fa fa-download fa-3x" aria-hidden="true"></i></a>
{%endblock content%}
